<script setup lang="ts">
import {onReachBottom} from "@dcloudio/uni-app";

/**
 * 加载数据
 * 1.滚动加载封装再hooks中,定义的参数已经是响应式无需重复定义
 * 2.使用
 *  pageIndex: 当前页码,默认为1
 *  loadStatus: 加载状态
 *  reachBottom: 滚动到底部的事件
 *  judgeFinish: 判断是否加载完成
 */
import useLoadMore from "@/hooks/useLoadMore/index"
// 导出方法，参数
const {pageIndex, loadStatus, reachBottom, judgeFinish, isFinish} = useLoadMore()

// 定义emits
const emits = defineEmits()

// 判断是否加载完成
const judgeTotal = (total: number) => {
  judgeFinish(total)
}

// 下拉刷新初始化参数
const refreshParams = () => {
  pageIndex.value = 1
  loadStatus.value = 'loadmore'
  isFinish.value = false
}

// 滚动到底部
onReachBottom(() => {
  reachBottom(() => {
    // 触发父组件的事件,传递当前页下标给父组件查询
    emits('reachBottom', pageIndex.value, isFinish.value)
  })
})

// 暴露方法给父组件调用
defineExpose({
  judgeTotal,
  refreshParams
})
</script>

<template>
  <!--  加载状态  -->
  <view class="pt-30rpx pb-200rpx">
    <uv-load-more :status="loadStatus"/>
  </view>
</template>